<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>发布图文活动</title>
  <style>
    *{
      padding: 0px;
      margin: 0px;
    }

    body{
      background:rgb(248, 247, 247);
    }

    .top{
      width: 100%;
      text-align: center;
      height: 40px;
      line-height: 40px;
      background: #fff;
    }

    .layui-upload-file {
      display: none!important;
      opacity: .01;
    }

    .layui-btn {
      display: inline-block;
      height: 38px;
      line-height: 38px;
      padding: 0 18px;
      background-color: #009688;
      color: #fff;
      white-space: nowrap;
      text-align: center;
      font-size: 14px;
      border: none;
      border-radius: 2px;
      cursor: pointer;
    }

    .title{
      width: 100%;
      height:40px;
      line-height: 40px;
      text-indent: 15px;
    }

    .inut,textarea{
      border-color: #e6e6e6;
      border-width: 1px;
      border-style: solid;
      background-color: #fff;
      border-radius: 2px;
      height: 25px;
      line-height: 25px;
    }

    textarea{
      height: 100px;
      width: 90%;
    }

    .layui-upload{
      padding-left: 15px;
      margin-top:15px;
    }

    .layui-upload-list{
      margin-top:15px;
    }

    .tijiao,.miaoshu{
      padding-left: 15px;
      margin-top:15px;
    }

    video{
      width: 150px;
      height: 150px;
    }

    #editor{
      width: 95%;
    }
  </style>
</head>
<body>
  <div class="maxbox">
    <div class="top">设置视频信息</div>
    <form class="layui-form" id="admin">

      <div class="title">
        标题信息：
        <input type="text" class="inut" name="title">
      </div>

      <div class="layui-upload" id="upload-thumb">
        <button type="button" class="layui-btn" id="thumb">上传封面图</button>
        <div class="layui-upload-list">
          <label class="layui-form-label"></label>
          <img class="layui-upload-img" id="demo1" width="150" height="150" {notempty name="$info.admin.thumb"}src="{$info.admin.thumb|geturl}"{/notempty}>
          <p id="demoText"></p>
        </div>
        <div class="layui-form-mid layui-word-aux">图片最佳尺寸640x640</div>
      </div>

      <div class="miaoshu">
        内容：<br/><br/>
        <textarea id="editor" name="content" placeholder="请输入"></textarea>
      </div>

      <input type="hidden" name="openid" value="{$user.openid}" />
      <input type="hidden" name="type" value="1" />
      <div class="tijiao">
          <button class="layui-btn" lay-submit lay-filter="admin">立即提交</button>
          <br/><br/><br/>
      </div>

    </form>
  </div>
  <script src="/static/common/layui/layui.js"></script>
  <script src="/static/common/jquery/jquery.min.js"></script>
  <!-- 加载编辑器的容器 -->
  <script id="editor" type="text/plain">
    这里写你的初始化内容
  </script>
  <!-- 配置文件 -->
  <script type="text/javascript" src="/static/common/ueditor/ueditor.config.js"></script>
  <!-- 编辑器源码文件 -->
  <script type="text/javascript" src="/static/common/ueditor/ueditor.all.js"></script>
  <!-- 实例化编辑器 -->
  <script type="text/javascript">
    var ue = UE.getEditor('editor');
  </script>
  <script>
    layui.use('upload', function(){
      var upload = layui.upload;
      //执行实例
      var uploadInst = upload.render({
        elem: '#thumb' //绑定元素
        ,url: "{:url('base/common/upload')}" //上传接口
        ,done: function(res){
          //上传完毕回调
          if(res.code == 2) {
            $('#demo1').attr('src',res.src);
            $('#upload-thumb').append('<input type="hidden" name="pic" value="'+ res.id +'">');
          } else {
            layer.msg(res.msg);
          } 
        }
        ,error: function(){
          //请求异常回调
          //演示失败状态，并实现重传
          var demoText = $('#demoText');
          demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
          demoText.find('.demo-reload').on('click', function(){
            uploadInst.upload();
          });
        }
      });
    });
  </script>
  <script>
    layui.use(['layer', 'form'], function() {
      var layer = layui.layer,
        $ = layui.jquery,
        form = layui.form;
      $(window).on('load', function() {
        form.on('submit(admin)', function(data) {
          $.ajax({
            url:"{:url('articleVideo/addEdit')}",
            data:$('#admin').serialize(),
            type:'post',
            async: false,
            success:function(res) {
              if(res.code == 1) {
                layer.alert(res.msg, function(index){
                  location.href = res.url;
                })
              } else {
                layer.msg(res.msg);
              }
            }
          })
          return false;
        });
      });
    });
  </script>

</body>
</html>